/**
* Created by ren on 2017/1/6.
*/
<template>
  <div class='bankList' v-if="bankData!==''">
    <div class="btns" style="border-bottom: 1px solid #ccc;height: 84px;margin: 0 10px;margin-bottom: 20px">
      <button class="btn" style="margin: 0;float: right;margin-top: 20px;margin-right: 10px;border-radius: 5px"
              @click="addBank">+ <span>绑定银行卡</span>
      </button>
    </div>
    <div class="item" v-for="(item,index) in bankData">
      <img :src="item.mPicture" style="width: 30px">
      <span>{{item.bankName}}（ **** **** **** {{item.account.substring(bankData[0].account.length-4)}}）</span>
      <span style="float: right;color: #0020e2;cursor:pointer" @click="deleteMyBank(item.id)">删除</span>
    </div>
    <Notify :parentThis='this'></Notify>
  </div>
</template>

<script>
  import API from '../../api'
  import Notify from '../Notify'
  export default {
    name: 'bankList',
    components: {
      Notify
    },
    data: function () {
      return {
        notifyStatus: 2,
        bankData: ''
      }
    },
    props: ['_parentThis'],
    methods: {
      findMyBankList: function () {
        this.$http.post(API.findMyBankList, {
          userId: this.$cookie.get('id'),
          nextPage: 0,
          pageSize: 10000
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            var bankName = ['福建兴业', '广州信合', '广州商业', '华夏', '徽商', '江苏', '交通', '南京', '上海浦东', '上海', '深圳发展', '招商', '浙商', '工商', '光大', '建设', '民生', '农业', '邮政', '中信', '北京', '中国']
            var mPicture = ['iconfont-xingyeyinxing', 'guangzhoushinongcunxin-yonghezuoshe', 'iconfont-guangzhoushangye01', 'iconfont-huaxiayinxing', 'huishang-yinhang', 'jingsu-yinhang', 'iconfont-jiaotongyinxing', 'iconfont-iconfontnanjing', 'iconfont-iconfontshanghaipudongfazhanyinxing', 'shanghai-yinhang', 'iconfont-icon0201fuben13', 'iconfont-zhaoshangyinxing', 'iconfont-zheshangyinxing', 'iconfont-zhongguogongshangyinxing', 'zhongguoguangda-yinhang', 'iconfont-jiansheyinxing', 'zhongguomingsheng-yinhang', 'iconfont-nongyeyinxing', 'iconfont-zhongguoyouzhengchuxuyinxing', 'iconfont-zhongxinyinxing', 'iconfont-iconfontbeijingyinxing', 'iconfont-zhongguoyinxing']
            for (var i = 0; i < result.object.length; i++) {
              for (var k = 0; k < bankName.length; k++) {
                if ((result.object[i].bankName).indexOf(bankName[k]) >= 0) {
                  result.object[i].mPicture = require('../../assets/my/bank/' + mPicture[k] + '.png')
                }
              }
            }
            this.bankData = result.object
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      },
      addBank: function () {
        this._parentThis.safeChild = 'addBank'
        this._parentThis.titHtml = '<span>信息安全 > <span>银行卡管理</span> > <span style="color: #f48315;">添加银行卡</span></span>'
      },
      deleteMyBank: function (id) {
        this.$http.post(API.deleteMyBank, {
          id: id
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            this.findMyBankList()
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      }
    },
    mounted: function () {
      this.findMyBankList()
    }
  }
</script>
